.CustomLogin
{
	position: relative; 
}

.CustomLogin H2
{
	padding: 0;
	margin: 0.5em 0 0.5em 0;
	color: black;
}

.CustomLogin FIELDSET
{
	border: 0;
	padding: 0;
}

.CustomLogin LEGEND
{
	display: none;
}

.CustomLogin input[type="radio"] + label, .CustomLogin input[type="checkbox"] + label
{
	margin-left: 0.5rem;
}


.CustomLogin .RetrievePassword UL
{
	margin-bottom: 0.5em;
}

.CustomLogin .RetrievePassword UL, .CustomLogin .RetrievePassword LI
{
	list-style-type: none;
	padding: 0;
	margin-top: 0.5rem;
}

.CustomLogin .ActionPanel
{
	margin-bottom: 0.5em;
}

.CustomLogin .LoginButtons
{
	display: block;
}

.CustomLogin .FieldLabel, .CustomLoginOptions .FieldLabel, .CustomLoginOptions .FieldLabelLink
{
	display: inline-block;
	width: 12em;
	padding-bottom: 10px; 
}


.CustomLogin .FieldValue, .CustomLoginOptions .FieldValue, .CustomLoginOptions .FieldValueLink
{
	display: inline-block; 
	padding-bottom: 10px;
}

.CustomLogin .FieldValue.UserName, .CustomLogin .FieldValue.Password
{
	position: relative;
}

.CustomLogin .overlaylabel
{
	position: absolute;
	color: #777;
	cursor: text;
	left: 4px;
	top: 4px;
}


.CustomLogin .RememberLogin
{
	display: block;
}

.CustomLogin .RememberLogin label
{
	margin-left: 0.25rem;
}

.CustomLogin .LinkValue A
{
	cursor: pointer;
}


.CustomLogin .Header, .CustomLogin .Footer
{
	padding-top: 10px;
	padding-bottom: 10px;
}

.CustomLogin .UserNameField, .CustomLogin .PasswordField, .CustomLogin .TextBoxField
{
	width: 20em;
}

.CustomLogin .Progress
{
	position: absolute;
	background-color: white;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	text-align: center;
	z-index: 1;
	display: none;	
	opacity: 0.75;
}

.CustomLogin .Progress.visible
{
	display: block;
}

.CustomLogin .Progress > div
{
	height: 100%;
	width: 100%;
}

.CustomLogin .Progress > div .progress-text
{
	display: none;
}

.CustomLogin .ProgressImage
{
	position: relative;
	top: 50%;
	margin-top: -16px;
}

.CustomLogin .ButtonPanel
{
	display: block;
	margin-top: 1rem;
	margin-bottom: 1rem;
}

.CustomLogin .RetrievePassword .FieldLabel
{
	width: 15rem;
}

.CustomLogin .RetrievePassword .FieldValue .NormalTextBox, .CustomLogin .ChangePassword .FieldValue .NormalTextBox
{
	width: 25rem;
}

.CustomLogin .mobile-only
{
  display: none;
}

.CustomLogin .CommandButton, .CustomLogin .CommandButton:hover, .CustomLogin .CommandButton:focus
{
	font-size: 1rem;  
	font-weight: bold!important;
	appearance: none;
	background-color: #1054A2!important;
	color: white!important;
	border: none;
	padding: .5rem 2rem;
	text-decoration: none!important;
}

.CustomLogin .CommandButton:hover, .CustomLogin .CommandButton:focus
{
	background-color: #012753!important;
}

@media handheld, only screen and (max-width: 767px) 
{
  .CustomLogin .mobile-only
  {
    display: block;
  }

	body, #skin_wrapper
	{
    height: 90vh!important; /* for old browsers that don't understand dvh units */
		height: 100dvh!important;
	}

  .logo_style
  {
    min-height: 0!important;
  }

	.site_logo
	{
		padding: 0 0 0 2%!important;
	}

	.skin_banner
	{
		min-height: .75rem!important;
	}

	.skin_main
	{
		min-height: auto!important;
		flex: 1;
	}

	.skin_main_padding
	{
		padding: 0!important;
	}

	.panel
	{
		color: black;
	}

	.panel-title
	{
    text-size-adjust: none;
		font-size: 1.25rem;
	}

	.panel-body
	{
		font-size: 1.1rem;
    padding: .5rem .25rem!important;
	}
  
  .panel-body .col-sm-12
  {
    padding: 0!important;
  }

  .panel-body p
  { 
    text-size-adjust: none;
    margin: 0!important;
  }

	.Footer, A.Footer:link, A.Footer:visited, A.Footer:active
	{    
    text-size-adjust: none;
		color: white!important;
		padding: 0!important;
	}

	.footer-left
	{
		padding: 0.25rem 0;
	}

  .skin_top
  {
    min-height: 8px!important;
  }

	.socialpane_style, .top_contact
	{
		padding: 0!important;
	}

	.row
	{
		margin-left: initial!important;
		margin-right: initial!important;
	}

	#skin_wrapper, .CustomLogin, .CustomLogin fieldset, .CustomLogin fieldset .InputRow, .CustomLogin .RetrievePassword
	{
		display: flex;
		flex-direction: column;
	}

	.CustomLogin
	{
		gap: 0.5rem;
	}

	.CustomLogin .ActionPanel
	{
		max-width: 80%;
		margin: auto;
	}

	.CustomLogin fieldset .InputRow
	{
		margin: auto;
	}
		
	.CustomLogin .ProgressImage
	{
		position: initial;
		top: initial;
		margin-top: 1rem;
	}

	.CustomLogin .ProgressImage > div
	{
		margin: auto;
		height: auto;
		width: auto;
	}
	
	.CustomLogin .Progress > div .progress-text
	{
		display: block;
	}

	.CustomLogin .Progress
	{
		opacity: initial;
	}

	.CustomLogin .Progress.visible
	{
		display: flex;
	}

	.CustomLogin .InputRow input[type=text], .CustomLogin .InputRow input[type=password]
	{
		font-size: 1.2rem;
	}

	.CustomLogin .InputRow .FieldLabel
	{
		padding-bottom: 0;
		width: auto;
		font-size: 1rem;
		margin-top: 0.5rem;
	} 
		
	.CustomLogin .LoginButtons
	{
		margin-left: 0;
	} 



	.CustomLogin .UserNameField, .CustomLogin .PasswordField, .CustomLogin .TextBoxField,
	.CustomLogin .InputRow, .CustomLogin .RememberLogin, .CustomLogin .Link
	{
		width: 20rem;  
	}

	.CustomLogin .Link
	{
		margin: auto;
		font-size: 1.25rem;
		text-decoration: dashed;
	}

	.CustomLogin .Link a
	{
    color: #1054A2!important;
		text-decoration: underline;
	}

	.CustomLogin .RememberLogin
	{
		display: flex;
		gap: 0.5rem;
		margin: 0.5rem 0;
	}
		
	.CustomLogin .RememberLogin input
	{
		margin-top: 0;
	}
	
	.CustomLogin .RememberLogin label
	{
		margin-bottom: 0;
		font-size: 1rem;
	}
	
	.CustomLogin .MessageDialog
	{
		display: flex;
		flex-direction: column;
	}

	.CustomLogin .MessageText
	{
		margin: auto;
		text-align: center;
		font-weight: bold;
	}
}